<template>
	<view class="container">
		<scroll-view class="list-box" scroll-y="true">
			<view class="item-box" v-for="(item,index) in list" :key="index" @click="contentClick(item)">
				<view class="image-box">
					<image :src="item.image_url"></image>
				</view>
				<view class="item-name">{{item.name}}</view>
			</view>
		</scroll-view>
		<s-popup ref="popup" type="center" :isMaskClick="false">
			<view class="loaading-box">
				<s-circular-progress progressColor="#EB0909" :duration="0" :diam="100" :lineWidth="8" :fontSize="20" fontColor="#EB0909" :percentage="percentage"></s-circular-progress>
				<view class="loaading-name">加载中...</view>
			</view>
		</s-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				percentage:0,
				list:[
					{
						"name":"义务教育教科书 · 数学一年级上册（人教版）",
						"image_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/1/1.png",
						"href_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/1/1.pdf",
					},
					{
						"name":"义务教育教科书 · 数学二年级上册（人教版）",
						"image_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/2/1.png",
						"href_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/2/1.pdf",
					},
					{
						"name":"义务教育教科书 · 数学三年级上册（人教版）",
						"image_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/3/1.png",
						"href_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/3/1.pdf",
					},
					{
						"name":"义务教育教科书 · 数学四年级上册（人教版）",
						"image_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/3/1.png",
						"href_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/3/1.pdf",
					},
					{
						"name":"义务教育教科书 · 数学五年级上册（人教版）",
						"image_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/3/1.png",
						"href_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/3/1.pdf",
					},
					{
						"name":"义务教育教科书 · 数学六年级上册（人教版）",
						"image_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/3/1.png",
						"href_url":"https://test.lvacms.cn/textbook/primarySchool/mathematics/1/3/1.pdf",
					}
				]
			}
		},
		onLoad() {
			// uni.setDisab
			 // disableScroll = true
			 // this.$refs.popup.open()
		},
		methods: {
			contentClick(item){
				let that = this;
				let url = item.href_url;
				let downloadTask = wx.downloadFile({//下载对应文件
					url: url, // 下载文件网络地址
					success: function (res) {
						var filePath = res.tempFilePath;//本地文件路径    
						wx.openDocument({
							filePath: filePath,   // 装载对应文件的路径
							fileType: 'pdf',   // 指定打开的文件类型 我写的固定类型 也可根据文件的后缀动态设置
							showMenu: true,       // 右上角的菜单转发分享操作
							success: function (res) {
								that.$refs.popup.close()
								console.log('打开成功');
								that.percentage = 0
							},
							fail: function (err) {
								that.$refs.popup.close()
								console.log('打开失败：', err);
								that.percentage = 0
							}
						})
					}
				})
			  that.$refs.popup.open()
			  downloadTask.onProgressUpdate((res) => {
				  console.log(res)
				  if(res.progress>that.percentage){
					  that.percentage = res.progress
				  }
				  if(that.percentage == 100){
					 that.$refs.popup.close()
					  that.percentage = 0
				  }
				   console.log('下载进度', res.progress)
			   })
			}
		}
	}
</script>

<style lang="scss" scoped>
@import 'index.scss';
</style>
